import React, { Component } from 'react'
import '../asserts/css/common.css'
import '../asserts/css/register.css'
import {Reg} from '../request/register'

export default class register extends Component {
    state = {
        phone: "13331153360",
        nickname: "",
        password: ""
    }
    reg(){
        var {phone,nickname,password} = this.state
        var formData = {
            phone,
            nickname,
            password
        }
        if(phone.trim() === ""){
            return alert("手机号不可以为空")
        }
        if(nickname.trim() === ""){
            return alert("昵称不可以为空")
        }
        if(password.trim() === ""){
            return alert("密码不可以为空")
        }
        
        Reg({phone,nickname,password}).then(res=>{
            if(res.code === 200){
                console.log(res)
            }
        })
        this.setState({phone:"",nickname:"",password:""})
        console.log(formData)
    }
    render() {
        return (
            <>
                <div className="page-title">会员注册</div>
                <div id="container">
                    <div className="logo"></div>
                    <div className="form">
                        <div className="form-group">
                            <input value={this.state.phone} onChange={e=>this.setState({phone: e.target.value})} type="text" placeholder="手机号" />
                        </div>
                        <div className="form-group">
                            <input value={this.state.nickname} onChange={e=>this.setState({nickname: e.target.value})} type="text" placeholder="昵称" />
                        </div>
                        <div className="form-group">
                            <input value={this.state.password} onChange={e=>this.setState({password: e.target.value})} type="password" placeholder="密码" />
                        </div>
                        <div className="form-group">
                            <button className="btn-gray" type="button" onClick={this.reg.bind(this)}>注册</button>
                        </div>
                    </div>
                </div>
            </>
        )
    }
}
